<template>
    <div class="index">
        <slider></slider>
        <advert></advert>
        <banner></banner>
        <mobile></mobile>
        <service></service>
        <modal title="提示" sure-text="查看购物车" cancel-text="cancel" btn-type="1" modal-type="middle" :show-modal="showModal"
               @submit="goToCart" @cancel="showModal = false">
            <p slot="body">商品添加成功</p>
        </modal>
    </div>
</template>

<script>
    import Service from "../../components/Service";
    import Slider from "./children/Slider";
    import Advert from "./children/Advert";
    import Banner from "./children/Banner";
    import Mobile from "./children/Mobile";
    import Modal from "../../components/Modal";
    import {addCart} from "network";

    export default {
        name: "Index",
        components: {
            Service,
            Slider,
            Advert,
            Banner,
            Mobile,
            Modal
        },
        data() {
            return {
                showModal: false
            }
        },
        methods: {
            // getIndexProductList() {
            //     getProductList().then(res => {
            //         if(res.list.length >= 6) {
            //             this.phoneList = res.list.slice(0,6) // slice取前6条数据
            //         }
            //     })
            // }
            addIndexCart(id) {
                addCart(id).then((res={cartProductVoList: 0}) => {
                    this.showModal = true;
                    this.$store.dispatch('saveCartCount', res.cartTotalQuantity);
                }).catch(() => {
                    this.showModal = true;
                })
            },
            goToCart() {
                this.$router.push('/cart')
            }
        },
        mounted() {
            this.$bus.$on('addCart', (id) => {
                this.addIndexCart(id)
            });

        }
    }
</script>

<style scoped lang="scss">

</style>
